<template>
  <div>
    <div class="outmain ba_f shopadd">
      <div class="maintitle">门店信息</div>
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="基本信息" name="1">
          <el-form ref="form" :model="form" label-width="180px">
            <el-form-item label="门店名称" :required="true" prop="name">
              <el-input v-model="form.name" style="width: 400px"></el-input>
            </el-form-item>
            <el-form-item label="门店ID" v-show="form.id">
              <el-input v-model="form.id" style="width: 400px" disabled></el-input>
              <el-button @click="copyText(form.id)" class="mar_l10">复制</el-button>
            </el-form-item>
            <el-form-item label="门店LOGO" :required="true">
              <div class="uploadSource bor_de rel flex" v-if="form.icon">
                <span @click="deleteMultiImage(form.icon,1)" class="curs ab closeicon" title="删除这张图片">
                  <i class="el-icon-circle-close fon_14 color_3"></i>
                </span>
                <img :src="form.icon" @click="test(1)" class="wid" />
              </div>
              <div class="uploadSource flex-center curs" v-else @click="test(1)">
                <i class="el-icon-plus fon_40 color_d9"></i>
              </div>
            </el-form-item>
            <el-form-item label="联系人" :required="true" prop="storeLinkMan">
              <el-input v-model="form.storeLinkMan" style="width: 400px"></el-input>
            </el-form-item>
            <el-form-item label="门店电话" :required="true" prop="storeTel">
              <el-input v-model="form.storeTel" style="width: 400px"></el-input>
            </el-form-item>
            <el-form-item label="所属区域" :required="true">
              <el-cascader v-model="form.cityArr" :options="data" size="medium" @change="cascaderChange" filterable></el-cascader>
            </el-form-item>
            <el-form-item label="门店类别" :required="true">
              <el-radio-group v-model="form.type">
                <el-radio label="1">直营店</el-radio>
                <el-radio label="2">加盟店</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="商品模式" :required="true">
              <el-radio-group v-model="form.goodsModel" v-if="id">
                <el-radio label="1" :disabled="BdgoodsModel!='1'" border>模式一：同步总店商品</el-radio>
                <el-radio label="2" :disabled="BdgoodsModel!='1'" border>模式二：同步总店商品</el-radio>
                <el-radio label="3" disabled border>模式三：超级商品权限</el-radio>
              </el-radio-group>
              <el-radio-group v-model="form.goodsModel" v-else>
                <el-radio label="1" border>模式一：同步总店商品</el-radio>
                <el-radio label="2" border>模式二：同步总店商品</el-radio>
                <el-radio label="3" border>模式三：超级商品权限</el-radio>
              </el-radio-group>
              <div class="yb_margin lh16 mar_t10" v-show="form.goodsModel=='1'">商品模式一：实时同步总店商品，可自行修改库存和商品上下架权限</div>
              <div class="yb_margin lh16 mar_t10" v-show="form.goodsModel=='2'">商品模式二：实时同步总店商品，可自行修改库存、价格和商品上下架权限</div>
              <div class="yb_margin lh16 mar_t10" v-show="form.goodsModel=='3'">商品模式三：自定义添加商品和商品分类，与总店商品无关</div>
              <div class="color-red">
                <span class="wei">温馨提示：</span>门店商品模式一旦选择后，请勿随意修改，以免造成门店商品数据错乱（商品模式一可升级到商品模式二，商品模式二和商品模式三一旦确定后将不可修改）
              </div>
            </el-form-item>
            <el-form-item label="详细地址" :required="true">
              <el-input placeholder="请输入地址" v-model="form.address" style="width: 400px">
                <el-button slot="append" @click="searchMapClick">搜索</el-button>
              </el-input>
            </el-form-item>
            <el-form-item label="店铺经纬度" :required="true">
              <el-input v-model="form.lng" disabled style="width: 130px" class></el-input>
              <el-input v-model="form.lat" disabled style="width: 130px" class="mar_l20"></el-input>
            </el-form-item>
            <el-form-item label="地图定位" :required="true">
              <div>
                <select-map ref="mapCom" :mapLng="+form.lng" :mapLat="+form.lat" :mapAddress="form.address" @clickmap="getMapdata"></select-map>
              </div>
            </el-form-item>
            <!--                        <el-form-item label="门店状态" :required="true">-->
            <!--                            <el-switch v-model="form.storeOpen" :active-value="'1'" :inactive-value="'2'"></el-switch>-->
            <!--                        </el-form-item>-->
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="门店信息" name="2">
          <el-form ref="form2" :model="form2" label-width="180px">
<!--            <el-form-item label="营业时间" :required="true">-->
<!--              <el-radio-group v-model="form2.timeType">-->
<!--                <el-radio label="1" border>全天24小时营业</el-radio>-->
<!--                <el-radio label="2" border>设置营业时间</el-radio>-->
<!--              </el-radio-group>-->
<!--              <div v-if="form2.timeType=='2'" class="mar_t10 zdy_tsinput">-->
<!--                <div class="time_item mar_b10" v-for="(item,index) in form2.timeArr" :key="index">-->
<!--                  <el-time-select v-model="item.startTime" :picker-options="{start: '00:00',step: '00:05',end: '23:55'}" placeholder="选择时间" @change="selectTime($event,item,index,1)"></el-time-select>-->
<!--                  <span class="mar_lr10">-</span>-->
<!--                  <span class="mar_r10" v-if="item.ciri">次日</span>-->
<!--                  <el-time-select v-model="item.endTime" :picker-options="{start: '00:00',step: '00:05',end: '23:55'}" placeholder="选择时间" @change="selectTime($event,item,index,2)"></el-time-select>-->
<!--                  <el-button type="text" @click="deltimeInterval(index)" class="fon_12 mar_l10">删除</el-button>-->
<!--                </div>-->
<!--                <el-button v-show="form2.timeArr.length<3" type="text" @click="addtimeInterval">-->
<!--                  <Icon type="md-add" />添加时段-->
<!--                </el-button>-->
<!--              </div>-->
<!--            </el-form-item>-->
            <el-form-item label="门店分组" :required="true">
              <el-select v-model="form2.typeId" placeholder="请选择门店所属分组">
                <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"></el-option>
              </el-select>
              <div class="yb_margin lh16">请选择门店所属分组,可按照分组统一设置抽佣比率以及活动类型</div>
            </el-form-item>
            <el-form-item label="门店区域" :required="true">
              <el-select v-model="form2.areaId" placeholder="请选择门店所属区域">
                <el-option v-for="item in arealList" :key="item.id" :label="item.name" :value="item.id"></el-option>
              </el-select>
              <div class="yb_margin lh16">请选择门店所属区域，可按照区域统一设置抽佣比率以及活动类型</div>
            </el-form-item>
            <el-form-item label="门店标签">
              <el-radio-group v-model="form2.label">
                <el-radio v-for="label in labelList" :label="label.id" :key="label.id">{{label.name}}</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="门店简介" :required="true">
              <el-input type="textarea" v-model="form2.introduction" placeholder="请输入门店简介" style="width: 400px"></el-input>
            </el-form-item>
            <el-form-item label="主营产品" :required="true">
              <el-input v-model="form2.mainDishes" style="width: 400px" placeholder="请输入主营产品"></el-input>
            </el-form-item>
            <el-form-item label="人均消费" :required="true">
              <el-input v-model="form2.perCapita" style="width: 400px" placeholder="请输入人均消费">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
            <!--                        <el-form-item label="店铺服务"  :required="true">-->
            <!--                            <el-checkbox-group v-model="form2.service">-->
            <!--                                <el-checkbox v-for="service in serviceList" :label="service.id" :key="service.id">-->
            <!--                                    {{service.name}}-->
            <!--                                </el-checkbox>-->
            <!--                            </el-checkbox-group>-->
            <!--                        </el-form-item>-->
            <el-form-item label="商家环境">
              <div class="uploadSource bor_de rel flex" v-for="(item, index) in form2.environment" :key="index">
                <span @click="deleteMultiImage(item,2,'multigraph')" class="curs ab closeicon" title="删除这张图片">
                  <i class="el-icon-circle-close fon_14 color_3"></i>
                </span>
                <img :src="item" @click="test(2)" class="wid img" />
              </div>
              <div class="uploadSource flex-center curs" @click="test(2)">
                <i class="el-icon-plus fon_40 color_d9"></i>
              </div>
            </el-form-item>
            <el-form-item label="商品安全档案" :required="true">
              <div class="uploadSource bor_de rel flex" v-for="(item, index) in form2.foodRecords" :key="index">
                <span @click="deleteMultiImage(item,3,'multigraph')" class="curs ab closeicon" title="删除这张图片">
                  <i class="el-icon-circle-close fon_14 color_3"></i>
                </span>
                <img :src="item" @click="test(3)" class="wid img" />
              </div>
              <div class="uploadSource flex-center curs" @click="test(3)">
                <i class="el-icon-plus fon_40 color_d9"></i>
              </div>
            </el-form-item>
            <el-form-item label="营业执照" :required="true">
              <div class="uploadSource bor_de rel flex" v-for="(item, index) in form2.license" :key="index">
                <span @click="deleteMultiImage(item,4,'multigraph')" class="curs ab closeicon" title="删除这张图片">
                  <i class="el-icon-circle-close fon_14 color_3"></i>
                </span>
                <img :src="item" @click="test(4)" class="wid img" />
              </div>
              <div class="uploadSource flex-center curs" @click="test(4)">
                <i class="el-icon-plus fon_40 color_d9"></i>
              </div>
            </el-form-item>
          </el-form>
        </el-tab-pane>
<!--        <el-tab-pane label="资质认证" name="3">-->
<!--          <el-form ref="form3" :model="form3" label-width="180px">-->
<!--            <el-form-item label="门店分组" :required="true">-->
<!--              <el-select v-model="form3.typeId" placeholder="请选择门店所属分组">-->
<!--                <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"></el-option>-->
<!--              </el-select>-->
<!--              <div class="yb_margin lh16">请选择门店所属分组,可按照分组统一设置抽佣比率以及活动类型</div>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="门店区域" :required="true">-->
<!--              <el-select v-model="form3.areaId" placeholder="请选择门店所属区域">-->
<!--                <el-option v-for="item in arealList" :key="item.id" :label="item.name" :value="item.id"></el-option>-->
<!--              </el-select>-->
<!--              <div class="yb_margin lh16">请选择门店所属区域，可按照区域统一设置抽佣比率以及活动类型</div>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="门店标签">-->
<!--              <el-radio-group v-model="form3.label">-->
<!--                <el-radio v-for="label in labelList" :label="label.id" :key="label.id">{{label.name}}</el-radio>-->
<!--              </el-radio-group>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="商品安全档案" :required="true">-->
<!--              <div class="uploadSource bor_de rel flex" v-for="(item, index) in form3.foodRecords" :key="index">-->
<!--                <span @click="deleteMultiImage(item,3,'multigraph')" class="curs ab closeicon" title="删除这张图片">-->
<!--                  <i class="el-icon-circle-close fon_14 color_3"></i>-->
<!--                </span>-->
<!--                <img :src="item" @click="test(3)" class="wid img" />-->
<!--              </div>-->
<!--              <div class="uploadSource flex-center curs" @click="test(3)">-->
<!--                <i class="el-icon-plus fon_40 color_d9"></i>-->
<!--              </div>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="营业执照" :required="true">-->
<!--              <div class="uploadSource bor_de rel flex" v-for="(item, index) in form3.license" :key="index">-->
<!--                <span @click="deleteMultiImage(item,4,'multigraph')" class="curs ab closeicon" title="删除这张图片">-->
<!--                  <i class="el-icon-circle-close fon_14 color_3"></i>-->
<!--                </span>-->
<!--                <img :src="item" @click="test(4)" class="wid img" />-->
<!--              </div>-->
<!--              <div class="uploadSource flex-center curs" @click="test(4)">-->
<!--                <i class="el-icon-plus fon_40 color_d9"></i>-->
<!--              </div>-->
<!--            </el-form-item>-->
<!--          </el-form>-->
<!--        </el-tab-pane>-->
        <el-tab-pane label="账号密码" name="4">
          <el-form ref="form4" :model="form4" :rules="rules4" label-width="180px">
            <el-form-item label="登录账号" prop="userName" required>
              <el-input v-model="form4.userName" autocomplete="off" placeholder="请输入登录账号"></el-input>
            </el-form-item>
            <el-form-item label="登录密码" prop="password" required>
              <el-input v-model="form4.password" type="password" autocomplete="off" placeholder="请输入登录密码"></el-input>
            </el-form-item>
            <!--                        <el-form-item label="确认密码" prop="checkPass">-->
            <!--                            <el-input v-model="form4.checkPass" type="password" autocomplete="off"-->
            <!--                                      placeholder="请确认密码"></el-input>-->
            <!--                        </el-form-item>-->
            <el-form-item label="绑定手机号" prop="bindTel" required>
              <el-input v-model="form4.bindTel" autocomplete="off" placeholder="请输入绑定手机号"></el-input>
            </el-form-item>
            <el-form-item label="关联微信管理员" v-if="app">
              <el-select v-model="form4.merchantId" clearable filterable  placeholder="请选择关联微信管理员">
                <el-option v-for="item in merchantUser" :key="item.id" :label="`${item.userName}（ID:${item.id}）`" :value="item.id"></el-option>
              </el-select>
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="提现方式" name="5">
          <el-form ref="form5" :model="form5" label-width="180px">
            <el-form-item label="提现方式">
              <el-radio-group v-model="form5.type">
                <el-radio label="1" v-if="form5.channel && form5.channel.indexOf('1') >= 0">微信</el-radio>
                <el-radio label="2" v-if="form5.channel && form5.channel.indexOf('2') >= 0">支付宝</el-radio>
                <el-radio label="3" v-if="form5.channel && form5.channel.indexOf('3') >= 0">银行卡</el-radio>
                <template v-if="form5.channel && form5.channel.indexOf('1') < 0 && form5.channel && form5.channel.indexOf('2') < 0 && form5.channel && form5.channel.indexOf('3') < 0">
                  <el-radio label="1">微信</el-radio>
                  <el-radio label="2">支付宝</el-radio>
                  <el-radio label="3">银行卡</el-radio>
                </template>
              </el-radio-group>
            </el-form-item>
            <div v-if="form5.type=='1'">
              <el-form-item label="手机号">
                <el-input v-model="form5.wxTel" placeholder="请输入手机号"></el-input>
              </el-form-item>
              <el-form-item label="用户ID">
                <el-input v-model="form5.userId" placeholder="请输入用户Id"></el-input>
                <el-button class="mar_l20" @click="onSearch">搜索</el-button>
                <div class="yb_margin lh16">*为了打款成功，请真实的填写您的用户ID号 当前绑定微信昵称：{{wName}}</div>
              </el-form-item>
              <el-form-item label="微信收款码图片">
                <div class="uploadSource bor_de rel flex" v-if="form5.wxImg">
                  <span @click="deleteMultiImage(form5.wxImg,5)" class="curs ab closeicon" title="删除这张图片">
                    <i class="el-icon-circle-close fon_14 color_3"></i>
                  </span>
                  <img :src="form5.wxImg" @click="test(5)" class="wid" />
                </div>
                <div class="uploadSource flex-center curs" v-else @click="test(5)">
                  <i class="el-icon-plus fon_40 color_d9"></i>
                </div>
              </el-form-item>
            </div>
            <div v-if="form5.type=='2'">
              <el-form-item label="手机号">
                <el-input v-model="form5.aliTel" placeholder="请输入手机号"></el-input>
              </el-form-item>
              <el-form-item label="支付宝账号">
                <el-input v-model="form5.aliAccount" placeholder="请输入支付宝账号"></el-input>
              </el-form-item>
              <el-form-item label="支付宝真实姓名">
                <el-input v-model="form5.aliUserName" placeholder="请输入支付宝真实姓名"></el-input>
              </el-form-item>
              <el-form-item label="支付宝收款码图片">
                <div class="uploadSource bor_de rel flex" v-if="form5.aliImg">
                  <span @click="deleteMultiImage(form5.aliImg,6)" class="curs ab closeicon" title="删除这张图片">
                    <i class="el-icon-circle-close fon_14 color_3"></i>
                  </span>
                  <img :src="form5.aliImg" @click="test(6)" class="wid" />
                </div>
                <div class="uploadSource flex-center curs" v-else @click="test(6)">
                  <i class="el-icon-plus fon_40 color_d9"></i>
                </div>
              </el-form-item>
            </div>
            <div v-if="form5.type=='3'">
              <el-form-item label="手机号">
                <el-input v-model="form5.bankTel" placeholder="请输入手机号"></el-input>
              </el-form-item>
              <el-form-item label="银行卡号">
                <el-input v-model="form5.bankAccount" placeholder="请输入银行卡号"></el-input>
              </el-form-item>
              <el-form-item label="所属银行">
                <el-input v-model="form5.bankName" placeholder="请输入所属银行"></el-input>
              </el-form-item>
              <el-form-item label="所属支行">
                <el-input v-model="form5.subBank" placeholder="请输入所属支行"></el-input>
              </el-form-item>
              <el-form-item label="真实姓名">
                <el-input v-model="form5.bankUserName" placeholder="请输入真实姓名"></el-input>
              </el-form-item>
            </div>
          </el-form>
        </el-tab-pane>
        <!--                <el-tab-pane label="自提地址" name="6" >-->
        <!--                    <el-form ref="form6" :model="form6" label-width="180px">-->
        <!--                        <el-form-item label="联系人">-->
        <!--                            <el-input v-model="form6.linkMan" autocomplete="off" placeholder="请输入联系人"></el-input>-->
        <!--                        </el-form-item>-->
        <!--                        <el-form-item label="联系电话">-->
        <!--                            <el-input v-model="form6.linkTel" autocomplete="off" placeholder="请输入联系电话"></el-input>-->
        <!--                        </el-form-item>-->
        <!--                        <el-form-item label="详细地址">-->
        <!--                            <el-input placeholder="请输入地址" v-model="form6.address" style="width: 400px">-->
        <!--                                <el-button slot="append" @click="searchMapClick2">搜索</el-button>-->
        <!--                            </el-input>-->
        <!--                        </el-form-item>-->
        <!--                        <el-form-item label="店铺经纬度">-->
        <!--                            <el-input v-model="form6.lng" disabled style="width: 130px" class=""></el-input>-->
        <!--                            <el-input v-model="form6.lat" disabled style="width: 130px" class="mar_l20"></el-input>-->
        <!--                        </el-form-item>-->
        <!--                        <el-form-item label="地图定位">-->
        <!--                            <div>-->
        <!--                                <select-mapt ref="mapCom2" :mapLng='+form6.lng' :mapLat='+form6.lat'-->
        <!--                                             :mapAddress='form6.address' @clickmap='getMapdata2'></select-mapt>-->
        <!--                            </div>-->
        <!--                        </el-form-item>-->
        <!--                    </el-form>-->
        <!--                </el-tab-pane>-->
      </el-tabs>
      <attachment-img ref="img1" type="img" @attachment="imgadd1"></attachment-img>
      <attachment-img ref="img2" type="imgs" @attachment="multigraph1"></attachment-img>
      <attachment-img ref="img3" type="imgs" @attachment="multigraph2"></attachment-img>
      <attachment-img ref="img4" type="imgs" @attachment="multigraph3"></attachment-img>
      <attachment-img ref="img5" type="img" @attachment="imgadd2"></attachment-img>
      <attachment-img ref="img6" type="img" @attachment="imgadd3"></attachment-img>
    </div>
    <div class="mar_t20 ba_f pad_20 t_c">
      <el-button type="primary" @click="onSubmit">保存</el-button>
    </div>
  </div>
</template>
<script>
import attachmentImg from '@/plugins/attachment-img';
import selectMap from '@/plugins/selectmap';
import selectMapt from '@/plugins/selectmapt';
import { getStoreBasic, postStoreBasic, getCity, getStoreBusiness, postStoreBusiness, getStoreAuth, posStoreAuth, getStoreAccount, posStoreAccount, getWithdrawal, postWithdrawal, getSelfAddress, posSelfAddress, getUserInfo ,getMerchantUser} from '@/api/shop';
import { getCoordinate } from '@/api/setup';

export default {
  name: 'shopadd',
  created() {
    this.initt();
    // this.getCoordinate()
    // this.edit();
    if (this.$route.query.id) {
      this.id = this.$route.query.id;
      this.edit();
    }
  },
  components: { attachmentImg, selectMap, selectMapt },
  data() {
    var checkAccount = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('账号不能为空'));
      }
    };
    var validatePass = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入密码'));
      } else {
        // if (this.form4.checkPass !== '') {
        //     this.$refs.form4.validateField('checkPass');
        // }
        callback();
      }
    };
    // var validatePass2 = (rule, value, callback) => {
    //     if (value === '') {
    //         callback(new Error('请再次输入密码'));
    //     } else if (value !== this.form4.password) {
    //         callback(new Error('两次输入密码不一致!'));
    //     } else {
    //         callback();
    //     }
    // };
    var checkTel = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('手机号不能为空'));
      }
    };
    return {
      activeName: '1',
      id: '',
      wName: '',
      form: {
        name: '',
        icon: '',
        storeTel: '',
        storeLinkMan: '',
        storeOpen: '1',
        type: '1',
        cityArr: [],
        lng: '',
        lat: '',
        address: '',
        id: '',
        goodsModel: '1',
      },
      BdgoodsModel:'',
      data: [], //门店区域
      form2: {
        timeType: '1',
        timeArr: [],
        mainDishes: '',
        perCapita: '',
        introduction: '',
        service: [],
        environment: [],
        id: '',
        label: '',
        typeId: '',
        areaId: '',
        foodRecords: [],
        license: []
      },
      serviceList: [],
      form3: {
        label: '',
        typeId: '',
        areaId: '',
        foodRecords: [],
        license: []
      },
      merchantUser:[],
      labelList: [],
      typeList: [],
      arealList: [],
      form4: {
        userName: '',
        password: '',
        // checkPass: '',
        bindTel: '',
        id: '',
        merchantId:'',
      },
      app:'',
      rules4: {
        password: [{ validator: validatePass, trigger: 'blur' }],
        // checkPass: [
        //     {validator: validatePass2, trigger: 'blur'}
        // ],
        userName: [{ validator: checkAccount, trigger: 'blur' }],
        bindTel: [{ validator: checkTel, trigger: 'blur' }]
      },
      form5: {
        type: '1',
        userId: '',
        wxTel: '',
        wxImg: '',
        aliTel: '',
        aliAccount: '',
        aliUserName: '',
        aliImg: '',
        bankTel: '',
        bankName: '',
        subBank: '',
        bankUserName: '',
        storeId: '',
        bankAccount: '',
        channel: ['1', '2', '3']
      },
      form6: {
        linkMan: '',
        linkTel: '',
        lng: '',
        lat: '',
        address: ''
      }
    };
  },
  methods: {
    copyText(storeId) {
      let Url2 = storeId;
      var oInput = document.createElement('input');
      oInput.value = Url2;
      document.body.appendChild(oInput);
      oInput.select();
      document.execCommand('Copy');
      oInput.className = 'oInput';
      oInput.style.display = 'none';
      this.$message({
        message: '复制成功',
        type: 'success'
      });
    },
    handleClick() {
      this.edit();
    },
    async onSearch() {
      const { data } = await getUserInfo({ id: this.form5.userId });
      this.wName = data.userName;
    },
    async initt() {
      const { data } = await getCity({ type: 3 });
      this.data = data;
    },
    // async getCoordinate(){
    //     const {data} = await getCoordinate();
    //     this.form.lat = data.lat?data.lat:114.304692
    //     this.form.lng = data.lng?data.lng:30.59331
    //     this.form.address = data.address?data.address:'湖北省武汉市'
    // },
    // async getCoordinate2(){
    //     const {data} = await getCoordinate();
    //     this.form6.lat = data.lat?data.lat:114.304692
    //     this.form6.lng = data.lng?data.lng:30.59331
    //     this.form6.address = data.address?data.address:'湖北省武汉市'
    // },
    async edit() {
      if (+this.activeName == '1') {
        const { data } = await getStoreBasic({ storeType: 2, id: this.id });
        if (this.id && data.id) {
          this.form = data;
          this.form.lat = +data.lat;
          this.form.lng = +data.lng;
          this.form.address = data.address;
          this.BdgoodsModel = data.goodsModel;
        }
      } else if (+this.activeName == '2') {
        const { data } = await getStoreBusiness({ storeType: 2, id: this.id });
        // this.serviceList = data.serviceList
        this.labelList = data.labelList;
        this.arealList = data.arealList;
        this.typeList = data.typeList;
        if (this.id && data.info.id) {
          this.form2 = data.info;
          if (data.info.timeType == '2') {
            this.form2.timeArr = data.info.timeArr.map((v) => ({
              startTime: v.startTime,
              endTime: v.endTime,
              ciri: v.ciri
            }));
          }
        }
      } else if (+this.activeName == '3') {
        const { data } = await getStoreAuth({ storeType: 2, id: this.id });
        this.labelList = data.labelList;
        this.arealList = data.arealList;
        this.typeList = data.typeList;
        if (this.id && data.info.id) {
          this.form3 = data.info;
        }
      } else if (+this.activeName == '4' && !this.id) {
        const { data } = await getMerchantUser();
        this.app = data.app?data.app:'';
        this.merchantUser = data.merchantUser?data.merchantUser:[]
      }else if (+this.activeName == '4' && this.id) {
        const { data } = await getStoreAccount({ storeType: 2, id: this.id });
        this.app = data.app?data.app:'';
        this.merchantUser = data.merchantUser?data.merchantUser:[]
        if (data.id) {
          this.form4.userName = data.userName;
          this.form4.password = data.passWord;
          this.form4.bindTel = data.phone;
          this.form4.userId = data.id;
          this.form4.merchantId = data.merchantId;
          // this.form4 = Object.assign({}, data)
        }
      } else if (+this.activeName == '5' && this.id) {
        const { data } = await getWithdrawal({ storeType: 2, storeId: this.id });
        if (data.storeId) {
          this.form5 = data;
        }
        Object.assign(this.form5, data);
        this.wName = data.userName;
        if (!data.type) {
          if (data.channel && data.channel.length) {
            this.form5.type = data.channel.sort()[0];
          } else {
            this.form5.type = '1';
          }
        }
      } else if (+this.activeName == '6' && this.id) {
        // this.getCoordinate2()
        setTimeout(() => {
          this.$refs.mapCom2.init();
        }, 200);
        const { data } = await getSelfAddress({ storeType: 2, storeId: this.id });
        if (data.storeId) {
          this.form6 = data;
          this.form6.lat = +data.lat;
          this.form6.lng = +data.lng;
          this.form6.address = data.address;
        }
      }
    },
    addtimeInterval() {
      let specObj = { startTime: '00:00', endTime: '00:00', ciri: true };
      this.$set(this.form2.timeArr, this.form2.timeArr.length, specObj);
    },
    deltimeInterval(index) {
      this.$delete(this.form2.timeArr, index);
    },
    selectTime(value, item, index, type) {
      //value是点击返回的时间，item是开始和结束时间，idnex是所有，type是区别是点击开始时间还是结束时间
      //type=1是判断开始时间，2是判断结束时间、、加type为了判断两种情况先选开始时间和先选结束时间
      //如果结束时间小于开始时间就为次日
      // console.log('111',value,item,index,type)
      // console.log('122',value,item.endTime,item.startTime)
      for (let i = 0; i < this.form2.timeArr.length; i++) {
        // console.log('index',i,index)
        if (i == index) {
          // console.log('当前选择数据')
          if (type == 1) {
            if (value >= item.endTime) {
              // console.log('111111')
              item.ciri = true;
            } else {
              item.ciri = false;
            }
          }
          if (type == 2) {
            // console.log('222222')
            if (value <= item.startTime) {
              item.ciri = true;
            } else {
              item.ciri = false;
            }
          }
        }
      }
    },
    test(i = 0) {
      // console.log(this.$refs, i)
      this.$refs['img' + i].dialogVisible = true;
    },
    imgadd1(url) {
      this.form.icon = url.str;
    },
    imgadd2(url) {
      this.form5.wxImg = url.str;
    },
    imgadd3(url) {
      this.form5.aliImg = url.str;
    },
    multigraph1(url) {
      if (this.form2.environment && this.form2.environment.length > 0) {
        this.form2.environment = this.form2.environment.concat(url.arr);
      } else {
        this.form2.environment = url.arr;
      }
    },
    multigraph2(url) {
      if (this.form2.foodRecords && this.form2.foodRecords.length > 0) {
        this.form2.foodRecords = this.form2.foodRecords.concat(url.arr);
      } else {
        this.form2.foodRecords = url.arr;
      }
    },
    multigraph3(url) {
      if (this.form2.license && this.form2.license.length > 0) {
        this.form2.license = this.form2.license.concat(url.arr);
      } else {
        this.form2.license = url.arr;
      }
    },
    deleteMultiImage(item, index, type) {
      //typem没传是单图multigraph多图；index上传图片组件排序
      Array.prototype.remove = function (val) {
        var index = this.indexOf(val);
        if (index > -1) {
          this.splice(index, 1);
        }
      };
      if (type == 'multigraph') {
        switch (index) {
          case 2:
            this.form2.environment.remove(item);
            break;
          case 3:
            this.form2.foodRecords.remove(item);
            break;
          case 4:
            this.form2.license.remove(item);
            break;
        }
      } else {
        switch (index) {
          case 1:
            this.form.icon = '';
            break;
          case 5:
            this.form5.wxImg = '';
            break;
          case 6:
            this.form5.aliImg = '';
            break;
        }
      }
    },
    getMapdata(mapAddress, mapLat, mapLng) {
      this.form.address = mapAddress;
      this.form.lat = mapLat;
      this.form.lng = mapLng;
    },
    searchMapClick() {
      console.log(this.$refs.mapCom); //返回的是一个vue对象，所以可以直接调用其方法
      this.$refs.mapCom.searchKeyword();
    },
    getMapdata2(mapAddress, mapLat, mapLng) {
      this.form6.address = mapAddress;
      this.form6.lat = mapLat;
      this.form6.lng = mapLng;
    },
    searchMapClick2() {
      console.log(this.$refs.mapCom2); //返回的是一个vue对象，所以可以直接调用其方法
      this.$refs.mapCom2.searchKeyword();
    },
    async onSubmit() {
      console.log('submit!');
      // console.log(this.form)
      if (this.activeName == '1') {
        this.$refs['form'].validate(async (valid) => {
          if (valid) {
            this.form.isMain = 2;
            const { msg } = await postStoreBasic(this.form);
            this.$baseMessage(msg, 'success');
            this.$router.push({ path: `/shoplist?currentPage=${this.$route.query.currentPage}&activeName=${this.$route.query.activeName}`});
          } else {
            return false;
          }
        });
      } else if (this.activeName == '2') {
        const { msg } = await postStoreBusiness(this.form2);
        this.$baseMessage(msg, 'success');
        this.$router.push({ path: `/shoplist?currentPage=${this.$route.query.currentPage}&activeName=${this.$route.query.activeName}`});
      } else if (this.activeName == '3') {
        const { msg } = await posStoreAuth(this.form3);
        this.$baseMessage(msg, 'success');
        this.$router.push({ path: `/shoplist?currentPage=${this.$route.query.currentPage}&activeName=${this.$route.query.activeName}`});
      } else if (this.activeName == '4') {
        if (this.id) {
          this.form4.id = this.id;
        }
        const { msg } = await posStoreAccount(this.form4);
        this.$baseMessage(msg, 'success');
        this.$router.go(-1);
      } else if (this.activeName == '5') {
        this.form5.storeId = this.id;
        const { msg } = await postWithdrawal(this.form5);
        this.$baseMessage(msg, 'success');
        this.$router.go(-1);
      } else if (this.activeName == '6') {
        this.form6.storeId = this.id;
        const { msg } = await posSelfAddress(this.form6);
        this.$baseMessage(msg, 'success');
        this.$router.go(-1);
      }
    },
    cascaderChange(e) {
      this.form.cityArr = e;
    }
  }
};
</script>
<style>
.shopadd .el-form {
  margin-top: 20px;
}
</style>
